import { getAuth } from '@/utils/storage';

/* 
   1 定义接收状态
   2 声明状态数据类型
   3 声明扩展类型 方便使用不会出错
   4 switch分支 接收数据到reducer状态中
   5 封装异步action的代码 获取请求数据   在 src\store\action\user.ts
   6 调用异步action   在 src\pages\Profile\Edit\index.tsx
*/

const initialState = {
  test: '1234',
  auth: getAuth(),
  user: {} as ProfileType,
  // 1 定义接收状态
  profile: {} as profileType1,
};
// auth的类型
export type AuthType = {
  refresh_token: string;
  token: string;
};

// 2 声明状态数据类型
// 用户信息类型 profile
export type profileType1 = {
  id: string;
  photo: string;
  name: string;
  mobile: string;
  gender: number;
  birthday: string;
  intro: string; // 后台没约定简介，后台没有返回改字段，手动加上
};

// 用户信息类型
export type ProfileType = {
  art_count: number;
  fans_count: number;
  follow_count: number;
  id: string;
  intro: null;
  like_count: number;
  name: string;
  photo: string;
};
//3 声明扩展类型 方便使用不会出错
// action类型
type actionType =
  | { type: 'user/login'; payload: AuthType }
  | { type: 'user/userInfo'; payload: ProfileType }
  | { type: 'user/profile'; payload: profileType1 }
  // 扩展ActionType的类型, 可以复用actionType
  | { type: 'user/edit'; payload: Partial<profileType1> };

export default function userReducer(state = initialState, action: actionType): typeof initialState {
  switch (action.type) {
    case 'user/login':
      return { ...state, auth: { ...action.payload } };
    case 'user/userInfo':
      return { ...state, user: { ...action.payload } };
    // 4 switch分支 接收数据到reducer状态中
    case 'user/profile':
      return { ...state, profile: { ...action.payload } };
    case 'user/edit':
      return {
        ...state,
        profile: {
          ...state.profile,
          ...action.payload,
        },
      };
    default:
      return state;
  }
}
